<br />

<p class='text-center lead'>联系状态表</p>
<p>过滤使用：在最上方的输入框输入文字，再点击页面其它地方，会过滤对应输入框之下列的内容。过滤条件删除后不会重新显示内容，需要点击“清除”按钮。</p>

<script language="JavaScript" type="text/javascript" src="http://<?php echo base_url(); ?>assets/JS/jquery.tablesorter.js"></script>

<a class='btn btn-success btn-sm' id="clear" role='button'>清除过滤条件</a>
<a class='btn btn-success btn-sm'  href='http://<?php echo base_url("index.php/contact_record/export_csv"); ?>' role='button'>导出</a>

<br />
<br />
<form class="form-horizontal" role="form">
	<div class="form-group">
		<div class="col-md-2">
			<input type = "text"  class="form-control" name = "client_name" id = "client_name" />
		</div>
		<div class="col-md-2">
			<input type = "text"  class="form-control" name = "contact_name" id = "contact_name" />
		</div>
		<div class="col-md-1">
			<input type = "text"  class="form-control" name = "name" id = "name" />
		</div>
		<div class="col-md-1">
			<input type = "text"  class="form-control" name = "contact_date" id = "contact_date" />
		</div>
		<div class="col-md-1">
			<input type = "text"  class="form-control" name = "means" id = "means" />
		</div>
		<div class="col-md-3">
			<input type = "text"  class="form-control" name = "status" id = "status" />
		</div>
		<div class="col-md-2">
			<input type = "text"  class="form-control" name = "status" id = "comment" />
		</div>
	</div>
</form>

<table class='table table-striped table-bordered' id = 'mytable'>
	<thead>
	<tr  class="info">
	<th class="col-md-2" ><strong>客户</strong></th>
	<th class="col-md-2" ><strong>联系人</strong></th>
	<th class="col-md-1" ><strong>负责人</strong></th>
	<th class="col-md-1" ><strong>联系日期</strong></th>
	<th class="col-md-1" ><strong>联系方式</strong></th>
	<th class="col-md-3" ><strong>状态</strong></th>
	<th class="col-md-2" ><strong>领导建议</strong></th>
	</tr>
	</thead>
	
	<tbody>
	{records}
		<tr>
		<td>{client_name}</td>
		<td>{contact_name}</td>
		<td>{name}</td>
		<td>{contact_date}</td>
		<td>{means}</td>
		<td>{status}</td>
		
		<td>
		<form class= "form-inline">
			<div class= 'form-group has-error'> 
				<input type = "text"  class="form-control comments {c_status}" name = "{id}" id = "{id}" value="{comment}"/>
			
			</div>
		</form>
		</td>
		
		</tr>
	{/records}
	</tbody>
</table>

<script type = "text/javascript">
jQuery(function() {
		//标记各种状态
		jQuery("input.2").parent().removeClass("has-error").addClass("has-success")
		//清除过滤条件
		//显示所有
		//清空inputs
		jQuery("#clear").click(function(){
			jQuery("table tbody tr").removeClass("hidden");
			jQuery("input").val("");
		});
		//改为失焦后执行吧
		//选择没有hidden的行，这样如果已过滤过，那么只有结果集没有
		jQuery("#client_name").blur(function(){
			var x = jQuery("#client_name").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(0)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		jQuery("#contact_name").blur(function(){
			var x = jQuery("#contact_name").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(1)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		//负责人
		jQuery("#name").blur(function(){
			var x = jQuery("#name").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(2)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		//联系日期
		jQuery("#contact_date").blur(function(){
			var x = jQuery("#contact_date").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(3)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		//联系方式
		jQuery("#means").blur(function(){
			var x = jQuery("#means").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(4)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		//联系状态
		jQuery("#status").blur(function(){
			var x = jQuery("#status").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(5)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		//Comments
		jQuery("#comment").blur(function(){
			var x = jQuery("#comment").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(6)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		//新增和修改，异步调用修改
		jQuery("input.comments").blur(function(){
			var x = jQuery(this).attr("id");
			var comment_des = jQuery(this).val();
			jQuery.post("http://<?php echo base_url(); ?>index.php/contact_record/ajax_comments",
				{
					id:x,
					comment:comment_des
				});
			
		});
	});

</script>

<script type="text/javascript">
	jQuery("#mytable").tablesorter();
</script>